Landing page's card components #369
Conversation
Image assets will be replaced with SVGs
✅ Deploy Preview for acre-dapp-testnet ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
| ) | ||
| } | ||
|
|
||
| const ValueCard = Object.assign(ValueCardBase, { FooterItem: Box }) |
There was a problem hiding this comment.
TBH I was confused for a first moment too. 😅 I would also prefer a chakra pattern to make the project consistent. I wonder more if we really need it. Note that ValueCard.FooterItem is simply a component Box without any additional styles. Using it with CurrencyBalance adds a non-necessary div. But I am fine with leaving it as it is.
Adjusted `IconCard` styling
Removed alternative layout, adjusted page container styles
`ValueCard` to `HighlightedValueCard`
There was a problem hiding this comment.
That's right. This button uses the card variant. The only thing this component does is add some additional styles. The name CardButton used here makes it look like a shared component. That's why I'm thinking about changing the name or maybe moving it to shared components. At the moment we don't have a style guide so it's difficult to make decisions. So we can leave it as is and then update it later. Just flagging the issue.
`IconCard` to `BenefitCard`
Used `children` prop instead, added style currency balance child component, update names for consistency
| @@ -13,9 +13,10 @@ export type CurrencyBalanceProps = { | |||
| shouldBeFormatted?: boolean | |||
| desiredDecimals?: number | |||
| size?: string | |||
| variant?: "greater-balance-xl" | "greater-balance-xxl" | |||
| variant?: "greater-balance-xl" | "greater-balance-xxl" | "unstyled" | |||
There was a problem hiding this comment.
It looks like we don't use this variant anywhere.
| variant?: "greater-balance-xl" | "greater-balance-xxl" | "unstyled" | |
| variant?: "greater-balance-xl" | "greater-balance-xxl" |
| ImageProps, | ||
| } from "@chakra-ui/react" | ||
|
|
||
| type IconCardProps = CardProps & { |
There was a problem hiding this comment.
| type IconCardProps = CardProps & { | |
| type BenefitCardProps = CardProps & { |
Closes: #363 ## Goal: To implement Landing Page This PR aggregates all component PRs to finally complete the implementation of landing page ## Component PRs: The list of PRs is given in the issue's description. Each component PR merges to this PR. - #357 - #358 - #364 - #368 - #369 ## Designs: <img width="1205" alt="image" src="https://github.com/thesis/acre/assets/11503879/be6b6ed2-a808-483e-9daf-43d2c042cba4">
Ref: #355
Goal:
To implement Landing page's card components
Features:
IconCardcomponentValueCardcomponentContentCardcomponent